<script setup>
defineProps({
  data: Object,
  onDiscussClick: Function,
})
</script>

<template>
  <div class="py-4 shadow-lg p-2 rounded-lg w-[200px]">
    <div class="text-sm pl-2 mb-2">话题列表</div>
    <div v-for="page in data.pages" :key="page.id">
      <div
        v-for="(item, index) in page.result.data"
        @click="onDiscussClick(item.id, item.title)"
        class="cursor-pointer hover:bg-slate-100 p-2 py-1 flex items-center gap-2"
        :key="item.id">
        <div>
          <div class="text-sm font-medium">#{{ item.title }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss"></style>
